<template>
  <div>
    <Row class="search-info-style">
      <Col span="6">
        <span style="">姓&#12288;&#12288;名：</span>
        <Input style="width: 70%;" v-model="searchInfo.CPBI003" />
      </Col>
      <Col span="6">
        <span style="">性&#12288;&#12288;别：</span>
        <Select v-model="searchInfo.CPBI005" clearable filterable transfer="" style="width: 70%;">
          <Option :value="'0'" >男</Option>
          <Option :value="'1'" >女</Option>
        </Select>
      </Col>
      <Col span="6">
        <span style="">年&#12288;&#12288;龄：</span>
        <Input style="width: 32%;" v-model="searchInfo.start_age" />&#160;~&#160;
        <Input style="width: 32%;" v-model="searchInfo.end_age" />
      </Col>
      <Col span="6">
        <span style="">超&#12288;&#12288;龄：</span>
        <Select v-model="searchInfo.isoverage" clearable filterable transfer="" style="width: 70%;">
          <Option :value="'Y'" >是</Option>
          <Option :value="'N'" >否</Option>
        </Select>
      </Col>
    </Row>
    <Row class="search-info-style" >
      <Col span="6">
        <span>政治面貌：</span>
        <Select clearable v-model="searchInfo.CPBI008" filterable transfer="" style="width: 70%;">
          <Option :value="item.TYPECODE" v-for="item in dictList[0]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
        </Select>
      </Col>
      <Col span="6" v-if="this.$store.state.user.severUserInfo.company_grade === '2'">
        <span>所在区县：</span>
        <Select v-model="searchInfo.CPWI023" filterable transfer="" clearable @on-change="getMailList2(4,searchInfo.CPWI023)" style="width:70%">
          <Option :value="item.code" v-for="item in mailList1" v-bind:key="item.code">{{item.name}}</Option>
        </Select>
        <!--        <Select v-model="searchInfo.CPWI023" filterable transfer="" style="width: 70%;" @on-change="getRegionList(searchInfo.CPWI023, 1)">-->
        <!--          <Option :value="item.CPSR001" v-for="item in reginList[0]" v-bind:key="item.CPSR001">{{item.CPSR002}}</Option>-->
        <!--        </Select>-->
      </Col>
      <Col span="6" v-if="this.$store.state.user.severUserInfo.company_grade === '2' || this.$store.state.user.severUserInfo.company_grade === '3'">
        <span>所在街道：</span>
        <Select v-model="searchInfo.CPWI024" filterable transfer="" clearable @on-change="getMailList2(5, searchInfo.CPWI024)" style="width:70%">
          <Option :value="item.code" v-for="item in mailList2" v-bind:key="item.code">{{item.name}}</Option>
        </Select>
        <!--        <Select v-model="searchInfo.CPWI024" filterable transfer="" style="width: 70%;" @on-change="getRegionList(searchInfo.CPWI024, 2)">-->
        <!--          <Option :value="item.CPSR001" v-for="item in reginList[1]" v-bind:key="item.CPSR001">{{item.CPSR002}}</Option>-->
        <!--        </Select>-->
      </Col>
      <Col span="6">
        <span>所在社区：</span>
        <Select v-model="searchInfo.CPWI025" filterable transfer="" clearable style="width:70%">
          <Option :value="item.code" v-for="item in mailList3" v-bind:key="item.code">{{item.name}}</Option>
        </Select>
        <!--        <Select v-model="searchInfo.CPWI025" filterable transfer="" style="width: 70%;" >-->
        <!--          <Option :value="item.CPSR001" v-for="item in reginList[2]" v-bind:key="item.CPSR001">{{item.CPSR002}}</Option>-->
        <!--        </Select>-->
      </Col>
    </Row>
    <Row class="search-info-style" >
      <Col span="6">
        <span style="">身份证号：</span>
        <Input style="width: 70%;" v-model="searchInfo.CPBI002" />
      </Col>
      <Col span="6">
        <span style="">联系方式：</span>
        <Input style="width: 70%;" v-model="searchInfo.CPBI013" />
      </Col>
      <Col span="6">
        <span>任职情况：</span>
        <Select v-model="searchInfo.CPWI006" filterable clearable transfer="" style="width: 70%;">
          <Option :value="item.TYPECODE" v-for="item in dictList[1]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
        </Select>
      </Col>
      <Col span="6">
        <span>注销原因：</span>
        <Select v-model="searchInfo.cancellation" clearable filterable transfer="" style="width: 70%;">
          <Option :value="item.TYPECODE" v-for="item in dictList[14]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
        </Select>
      </Col>
    </Row>
    <Row class="search-info-style">
      <Col span="4">
        <Button class="new-btn-sty" @click="findinit">
          <Icon type="ios-search" /> 查询
        </Button>
        <Button class="new-btn-sty" @click="showPerson(1)" >
          <Icon type="ios-body" /> 查看
        </Button>
      </Col>
    </Row>
    <Table border :columns="columns" :data="data" ref="personSelection" @on-select="selectTable" style="margin-top:10px;" @on-selection-change="personSelection()">
      <template slot-scope="{row}" slot="cancellation">
        <span :value="item.TYPECODE" v-for="item in dictList[14]" v-bind:key="item.TYPECODE" v-if="row.cancellation == item.TYPECODE">{{item.TYPENAME}}</span>
      </template>
    </Table>
    <Row v-if="loadData == true">
      <Col class="demo-spin-col" span="8" offset="8">
        <Spin fix>
          <Icon type="ios-loading" size=18 class="demo-spin-icon-load"></Icon>
          <div>数据正在加载</div>
        </Spin>
      </Col>
    </Row>
    <Page class="page_style" :total="totalnum" :current="currentPageNo"
          :page-size="currentPageSize" @on-change="changePageNo" show-total  show-sizer @on-page-size-change="size"/>
    <Modal
      v-model="showModal"
      title="查看"
      width="100%">
      <div style="width: 100%;">
        <Row class="bench_search" >
          <Col span="5" align="center" >唯一识别编号<span style="color: red">(必填)</span></Col>
          <Col span="6">
            <Input disabled v-model="showinfo.CPBI001" type="text" style="width: 52.5%"></Input>
          </Col>
          <Col span="4" align="center" >身份证号<span style="color: red">(必填)</span></Col>
          <Col span="9">
            <Input disabled v-model="showinfo.CPBI002" type="text" style="width: 35%"></Input>
          </Col>
        </Row>
        <Row class="bench_search" >
          <Col span="5" align="center" >姓名<span style="color: red">(必填)</span></Col>
          <Col span="6">
            <Input disabled v-model="showinfo.CPBI003" type="text" style="width: 52.5%"></Input>
          </Col>
          <Col span="4" align="center" >出生日期<span style="color: red">(必填)</span></Col>
          <Col span="9">
            <Input disabled v-model="showinfo.CPBI004" type="text" style="width: 35%"></Input>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">性别<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Select disabled v-model="showinfo.CPBI005" filterable transfer="" style="width: 52.5%;">
              <Option :value="'0'" >男</Option>
              <Option :value="'1'" >女</Option>
            </Select>
          </Col>
          <Col span="4" align="center">婚姻状况<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Select disabled v-model="showinfo.CPBI006" filterable transfer="" style="width: 35%;">
              <Option :value="item.TYPECODE" v-for="item in dictList[3]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
            </Select>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">民族<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Select disabled v-model="showinfo.CPBI007" filterable transfer="" style="width: 52.5%;">
              <Option :value="item.TYPECODE" v-for="item in dictList[4]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
            </Select>
          </Col>
          <Col span="4" align="center">政治面貌<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Select disabled v-model="showinfo.CPBI008" filterable transfer="" style="width: 35%;">
              <Option :value="item.TYPECODE" v-for="item in dictList[0]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
            </Select>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">是否退役士兵定向<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Select disabled v-model="showinfo.CPBI009" filterable transfer="" style="width: 52.5%;">
              <Option :value="'Y'" >是</Option>
              <Option :value="'N'" >否</Option>
            </Select>
          </Col>
          <Col span="4" align="center">是否军嫂定向<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Select disabled v-model="showinfo.CPBI010" filterable transfer="" style="width: 35%;">
              <Option :value="'Y'" >是</Option>
              <Option :value="'N'" >否</Option>
            </Select>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">是否为低保或低保边缘户子女<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Select disabled v-model="showinfo.CPBI011" filterable transfer="" style="width: 52.5%;">
              <Option :value="'Y'" >是</Option>
              <Option :value="'N'" >否</Option>
            </Select>
          </Col>
          <Col span="4" align="center">户籍地址<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Input disabled v-model="showinfo.CPBI012" type="text" style="width: 35%"></Input>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">联系方式<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Input disabled v-model="showinfo.CPBI013" type="text" style="width: 52.5%"></Input>
          </Col>
          <Col span="4" align="center">家庭住址<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Input disabled v-model="showinfo.CPBI014" type="text" style="width: 35%"></Input>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">免冠照片<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <div v-for="(item, index) in fileUrlList" :key="index" >
              <img :src="item" :title="item" width="150px" height="200px" style="color: #457eca; font-size: 14px;"></img>
            </div>
          </Col>
          <Col span="4" align="center">身份证正反上传<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <div v-for="(item, index) in fileUrlList2" :key="index" style="float: left; margin-right: 5px">
              <img :src="item" :title="item" width="250px" height="170px" style="color: #457eca; font-size: 14px;"></img>
            </div>
            <div v-for="(item, index) in fileUrlList3" :key="index + '0'" style="float: left">
              <img :src="item" :title="item" width="250px" height="170px" style="color: #457eca; font-size: 14px;"></img>
            </div>
          </Col>
        </Row>
        <!--        <Row class="bench_search">-->
        <!--          <Col span="5" align="center">在职状态</Col>-->
        <!--          <Col span="6" >-->
        <!--            <Select disabled v-model="showinfo.CPBI017" filterable transfer="" style="width: 52.5%;">-->
        <!--              <Option :value="item.TYPECODE" v-for="item in dictList[5]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>-->
        <!--            </Select>-->
        <!--          </Col>-->
        <!--          <Col span="4" align="center">审批状态</Col>-->
        <!--          <Col span="9" >-->
        <!--            <Select disabled v-model="showinfo.CPBI018" filterable transfer="" style="width: 35%;">-->
        <!--              <Option :value="item.TYPECODE" v-for="item in dictList[6]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>-->
        <!--            </Select>-->
        <!--          </Col>-->
        <!--        </Row>-->
        <!--        <Row class="bench_search" >-->
        <!--          <Col span="5" align="center" >银行卡号<span style="color: red">(必填)</span></Col>-->
        <!--          <Col span="6">-->
        <!--            <Input disabled v-model="showinfo.bankcardno" type="text" style="width: 52.5%"></Input>-->
        <!--          </Col>-->
        <!--          <Col span="4" align="center" >应发工资<span style="color: red">(必填)</span></Col>-->
        <!--          <Col span="9">-->
        <!--            <Input disabled v-model="showinfo.salary" type="text" style="width: 35%"></Input>-->
        <!--          </Col>-->
        <!--        </Row>-->
        <!--        &lt;!&ndash;是否兼职、是否兼职收入  &ndash;&gt;-->
        <!--        <Row class="bench_search" >-->
        <!--          <Col span="5" align="center" >是否兼职<span style="color: red">(必填)</span></Col>-->
        <!--          <Col span="6">-->
        <!--            <Select disabled v-model="showinfo.part_time_job" filterable transfer="" style="width: 52.5%;">-->
        <!--              <Option :value="'1'">是</Option>-->
        <!--              <Option :value="'0'">否</Option>-->
        <!--            </Select>-->
        <!--          </Col>-->
        <!--          <Col span="4" align="center" >是否兼职收入<span style="color: red">(必填)</span></Col>-->
        <!--          <Col span="9">-->
        <!--            <Select disabled v-model="showinfo.part_time_income" filterable transfer="" style="width: 35%;">-->
        <!--              <Option :value="'1'">是</Option>-->
        <!--              <Option :value="'0'">否</Option>-->
        <!--            </Select>-->
        <!--          </Col>-->
        <!--        </Row>-->
      </div>
      <div style="width: 100%;">
        <Tabs type="card">
          <TabPane label="教育信息">
            <Row class="bench_search" >
              <Col span="5" align="center" >毕业院校<span style="color: red">(必填)</span></Col>
              <Col span="7">
                <Input disabled v-model="showinfo.CPEI002" type="text" style="width: 35%"></Input>
              </Col>
              <Col span="4" align="center" >所学专业<span style="color: red">(必填)</span></Col>
              <Col span="8">
                <Input disabled v-model="showinfo.CPEI003" type="text" style="width: 35%"></Input>
              </Col>
            </Row>
            <Row class="bench_search">
              <Col span="5" align="center">最高学历<span style="color: red">(必填)</span></Col>
              <Col span="7" >
                <Select disabled v-model="showinfo.CPEI004" filterable transfer="" style="width: 35%;">
                  <Option :value="item.TYPECODE" v-for="item in dictList[7]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
                </Select>
              </Col>
              <Col span="4" align="center">学位<span style="color: red">(必填)</span></Col>
              <Col span="8" >
                <Select disabled v-model="showinfo.CPEI005" filterable transfer="" style="width: 35%;">
                  <Option :value="item.TYPECODE" v-for="item in dictList[8]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
                </Select>
              </Col>
            </Row>
            <Row class="bench_search">
              <Col span="5" align="center">毕业时间<span style="color: red">(必填)</span></Col>
              <Col span="7" >
                <DatePicker disabled type="date"  v-model="showinfo.CPEI006" :transfer=true style="width: 35%;"></DatePicker>
              </Col>
            </Row>
          </TabPane>
          <TabPane label="亲属信息">
            <!--            <Row>-->
            <!--              <Col span="1">-->
            <!--                <Button type="primary" @click="addFamily">添加</Button>-->
            <!--              </Col>-->
            <!--              <Col span="1">-->
            <!--                <Button type="primary" @click="delFamily">删除</Button>-->
            <!--              </Col>-->
            <!--            </Row>-->
            <Table width="850" border :columns="familyInfoTable" :data="familyInfoList" ref="familySelection2"  @on-selection-change="familySelection()"  style="margin-top: 10px;">
              <template  slot-scope="{ row }" slot="CPFI002">
                <Input disabled v-model="row.CPFI002" type="text"></Input>
              </template>
              <template slot-scope="{ row }" slot="CPFI003">
                <Select v-model="row.CPFI003" filterable transfer="" >
                  <Option disabled :value="item.TYPECODE" v-for="item in dictList[9]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
                </Select>
              </template>
              <template slot-scope="{ row }" slot="CPFI004">
                <Input disabled v-model="row.CPFI004" type="text" ></Input>
              </template>
              <template slot-scope="{ row }" slot="CPFI005">
                <Input disabled v-model="row.CPFI005" type="text" ></Input>
              </template>
              <template slot-scope="{ row }" slot="CPFI006">
                <Select disabled v-model="row.CPFI006" filterable transfer="" >
                  <Option :value="item.TYPECODE" v-for="item in dictList[0]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
                </Select>
              </template>
              <template slot-scope="{ row, index }" slot="action1">
                <Button disabled type="primary" @click="confirm(row, index)">确认</Button>
              </template>
            </Table>
          </TabPane>
          <TabPane label="职业信息">
            <div style="overflow-y:auto;height: 200px">
              <Row class="bench_search" >
                <Col span="5" align="center" >社会工作师职业资格:</Col>
                <Col span="6">
                  <Select disabled v-model="showinfo.CPWI002" filterable transfer="" style="width: 52.5%">
                    <Option :value="item.TYPECODE" v-for="item in dictList[10]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
                  </Select>
                </Col>
                <Col span="4" align="center" >社会工作师职业资格取得时间:</Col>
                <Col span="9">
                  <DatePicker disabled type="date"  v-model="showinfo.CPWI003" :transfer=true style="width: 35%;"></DatePicker>
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >所属市区:<span style="color: red">(必填)</span></Col>
                <Col span="6">
                  <Select v-model="showinfo.CPWI023" disabled filterable transfer="" clearable @on-change="getMailList2(4,showinfo.CPWI023)" style="width:52.5%">
                    <Option :value="item.code" v-for="item in mailList1" v-bind:key="item.code">{{item.name}}</Option>
                  </Select>
                  <!--                  <Select disabled v-model="showinfo.CPWI023" filterable transfer="" style="width: 52.5%" @on-change="getRegionList(showinfo.CPWI023, 1)">-->
                  <!--                    <Option :value="item.CPSR001" v-for="item in reginList[0]" v-bind:key="item.CPSR001">{{item.CPSR002}}</Option>-->
                  <!--                  </Select>-->
                </Col>
                <Col span="4" align="center" >街道:</Col>
                <Col span="9">
                  <Select v-model="showinfo.CPWI024" disabled filterable transfer="" clearable @on-change="getMailList2(5, showinfo.CPWI024)" style="width:35%">
                    <Option :value="item.code" v-for="item in mailList2" v-bind:key="item.code">{{item.name}}</Option>
                  </Select>
                  <!--                  <Select disabled v-model="showinfo.CPWI024" filterable transfer="" style="width: 35%" @on-change="getRegionList(showinfo.CPWI024, 2)">-->
                  <!--                    <Option :value="item.CPSR001" v-for="item in reginList[1]" v-bind:key="item.CPSR001">{{item.CPSR002}}</Option>-->
                  <!--                  </Select>-->
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >社区:</Col>
                <Col span="6">
                  <Select v-model="showinfo.CPWI025" disabled filterable transfer="" clearable style="width:52.5%">
                    <Option :value="item.code" v-for="item in mailList3" v-bind:key="item.code">{{item.name}}</Option>
                  </Select>
                  <!--                  <Select disabled v-model="showinfo.CPWI025" filterable transfer="" style="width: 52.5%">-->
                  <!--                    <Option :value="item.CPSR001" v-for="item in reginList[2]" v-bind:key="item.CPSR001">{{item.CPSR002}}</Option>-->
                  <!--                  </Select>-->
                </Col>
                <Col span="4" align="center" >入职时间:<span style="color: red">(必填)</span></Col>
                <Col span="9">
                  <DatePicker disabled type="date"  v-model="showinfo.CPWI001" :transfer=true style="width: 35%;"></DatePicker>
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >任职情况:<span style="color: red">(必填)</span></Col>
                <Col span="6">
                  <Select disabled v-model="showinfo.CPWI006" filterable transfer="" style="width: 52.5%">
                    <Option :value="item.TYPECODE" v-for="item in dictList[1]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
                  </Select>
                </Col>
                <Col span="4" align="center" >任职时间:<span style="color: red">(必填)</span></Col>
                <Col span="9">
                  <DatePicker disabled type="date"  v-model="showinfo.CPWI007" :transfer=true style="width: 35%;"></DatePicker>
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >是否党组织成员:<span style="color: red">(必填)</span></Col>
                <Col span="6">
                  <Select disabled v-model="showinfo.CPWI011" filterable transfer="" style="width: 52.5%">
                    <Option :value="'Y'" >是</Option>
                    <Option :value="'N'" >否</Option>
                  </Select>
                </Col>
                <Col span="4" align="center" >是否居委会成员:</Col>
                <Col span="9">
                  <Select disabled v-model="showinfo.CPWI012" filterable transfer="" style="width: 35%">
                    <Option :value="'Y'" >是</Option>
                    <Option :value="'N'" >否</Option>
                  </Select>
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >笔试成绩:</Col>
                <Col span="6">
                  <Input disabled v-model="showinfo.CPWI008" type="text" style="width: 52.5%"></Input>
                </Col>
                <Col span="4" align="center" >面试成绩:</Col>
                <Col span="9">
                  <Input disabled v-model="showinfo.CPWI009" type="text" style="width: 35%"></Input>
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >其他职业资格:</Col>
                <Col span="6">
                  <Input disabled v-model="showinfo.CPWI004" type="text" style="width: 52.5%"></Input>
                </Col>
                <Col span="4" align="center" >继续教育情况:</Col>
                <Col span="9">
                  <Input disabled v-model="showinfo.CPWI015" type="text" style="width: 35%"></Input>
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >是否取得全科社工资格:<span style="color: red">(必填)</span></Col>
                <Col span="6">
                  <Select disabled v-model="showinfo.CPWI016" filterable transfer="" style="width: 52.5%">
                    <Option :value="'Y'" >是</Option>
                    <Option :value="'N'" >否</Option>
                  </Select>
                </Col>
                <Col span="4" align="center" >全科社工资格取得时间:<span style="color: red">(必填)</span></Col>
                <Col span="9">
                  <DatePicker disabled type="date"  v-model="showinfo.CPWI005" :transfer=true style="width: 35%;"></DatePicker>
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >社会保险缴费记录:</Col>
                <Col span="6">
                  <CheckboxGroup disabled v-model="showinfo.CPWI017">
                    <Checkbox label="01">养老保险</Checkbox>
                    <Checkbox label="02">医疗保险</Checkbox>
                    <Checkbox label="03">失业保险</Checkbox>
                    <Checkbox label="04">工伤保险</Checkbox>
                    <Checkbox label="05">生育保险</Checkbox>
                    <Checkbox label="06">住房公积金</Checkbox>
                  </CheckboxGroup>
                </Col>
                <Col span="4" align="center" >初次缴纳时间:</Col>
                <Col span="9">
                  <DatePicker disabled type="date"  v-model="showinfo.CPWI018" :transfer=true style="width: 35%;"></DatePicker>
                </Col>
              </Row>
              <!-- 是否有财政负担保险、其他财政负担保险  <Input disabled v-model="row.CPFI004" type="text" ></Input>-->
              <Row class="bench_search">
                <Col span="5" align="center" >是否有财政负担保险:<span style="color: red">(必填)</span></Col>
                <Col span="6">
                  <Select disabled v-model="showinfo.financial_burden" filterable transfer="" style="width: 52.5%">
                    <Option :value="'1'" >是</Option>
                    <Option :value="'0'" >否</Option>
                  </Select>
                </Col>

                <Col span="4" align="center" >其他财政负担保险:<span style="color: red"></span></Col>
                <Col span="9">
                  <Input disabled v-model="showinfo.other_financial_burden" type="text" style="width: 35%"></Input>
                  <!--                  <Input disabled v-model="showinfo.other_financial_burden"></Input>-->
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >是否连续缴纳:<span style="color: red">(必填)</span></Col>
                <Col span="6">
                  <Select disabled v-model="showinfo.CPWI019" filterable transfer="" style="width: 52.5%">
                    <Option :value="'Y'" >是</Option>
                    <Option :value="'N'" >否</Option>
                  </Select>
                </Col>
                <Col span="4" align="center" >接续缴纳时间:</Col>
                <Col span="9">
                  <DatePicker disabled type="date"  v-model="showinfo.CPWI020" :transfer=true style="width: 35%;"></DatePicker>
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >培训记录:</Col>
                <Col span="6">
                  <Select disabled v-model="showinfo.CPWI014" filterable transfer="" style="width: 52.5%">
                    <Option :value="item.TYPECODE" v-for="item in dictList[11]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
                  </Select>
                </Col>
                <Col span="4" align="center" >综合评定:</Col>
                <Col span="9">
                  <Select disabled v-model="showinfo.CPWI013" filterable transfer="" style="width: 35%">
                    <Option :value="'10'" >优秀</Option>
                    <Option :value="'20'" >称职</Option>
                    <Option :value="'40'" >不称职</Option>
                  </Select>
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >离职时间:</Col>
                <Col span="6">
                  <DatePicker disabled type="date"  v-model="showinfo.CPWI021" :transfer=true style="width: 52.5%;"></DatePicker>
                </Col>
                <Col span="4" align="center" >人员类型:</Col>
                <Col span="9">
                  <CheckboxGroup disabled v-model="showinfo.personnel_type">
                    <Checkbox label="1">村(社区)党组织成员</Checkbox>
                    <Checkbox label="2">村(居)委员会成员</Checkbox>
                    <Checkbox label="3">村(社区)专职人员</Checkbox>
                    <Checkbox label="4">乡镇(街道)派驻人员</Checkbox>
                    <Checkbox label="5">社区网格员</Checkbox>
                    <Checkbox label="6">社区公益岗位</Checkbox>
                    <Checkbox label="7">村(居)务监督委员会成员</Checkbox>
                    <Checkbox label="8">村(居)民小组长</Checkbox>
                    <Checkbox label="9">其他人员</Checkbox>
                  </CheckboxGroup>
                </Col>
              </Row>
              <Row class="bench_search" >
                <Col span="5" align="center" >是否返聘:</Col>
                <Col span="6">
                  <Select disabled v-model="showinfo.back" filterable transfer="" style="width: 52.5%">
                    <Option :value="'1'" >是</Option>
                    <Option :value="'0'" >否</Option>
                  </Select>
                </Col>
                <Col span="4" align="center" >返聘原因:</Col>
                <Col span="9">
                  <Input disabled v-model="showinfo.back_cause" type="text" style="width: 35%"></Input>
                </Col>
              </Row>
            </div>
          </TabPane>
          <TabPane label="考核信息">
            <Table width="850" border :columns="assessmentInfoTable" :data="assessmentInfoList" ref="assessmentSelection2"  @on-selection-change="assessmentSelection()"  style="margin-top: 10px;">
              <template  slot-scope="{ row }" slot="CPKI001">
                <Select disabled v-model="row.CPKI001" filterable transfer="" >
                  <Option :value="item.TYPECODE" v-for="item in dictList[12]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
                </Select>
              </template>
              <template slot-scope="{ row }" slot="CPKI002">
                <DatePicker disabled type="date"  v-model="row.CPKI002" :transfer=true ></DatePicker>
              </template>
              <template slot-scope="{ row }" slot="CPKI003">
                <Select disabled v-model="row.CPKI003" filterable transfer="" >
                  <Option :value="item.TYPECODE" v-for="item in dictList[13]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
                </Select>
              </template>
              <template slot-scope="{ row, index }" slot="action1">
                <Button disabled type="primary" @click="confirm2(row, index)">确认</Button>
              </template>
            </Table>
          </TabPane>
          <!--          <TabPane label="经历届次">-->
          <!--            <Table width="850" border :columns="sessionInfoTable" :data="sessionInfoList" ref="sessionSelection1"  @on-selection-change="sessionSelection1()"  style="margin-top: 10px;">-->
          <!--              <template  slot-scope="{ row }" slot="year">-->
          <!--                <Select v-model="row.id" filterable transfer="" >-->
          <!--                  <Option :value="item.id" v-for="item in sessionList" v-bind:key="item.id">{{item.year}}</Option>-->
          <!--                </Select>-->
          <!--              </template>-->
          <!--              <template slot-scope="{ row, index }" slot="action1">-->
          <!--                <Button type="primary" @click="confirm3(row, index)">确认</Button>-->
          <!--              </template>-->
          <!--            </Table>-->
          <!--          </TabPane>-->
          <TabPane label="劳动合同">
            <div style="overflow-y:auto;height: 200px">
              <Row class="bench_search" >
                <Col span="5" align="center" >劳动合同:</Col>
                <Col span="6">
                  <Select disabled v-model="showinfo.labor_contract" filterable transfer="" style="width: 35%">
                    <Option :value="'0'" >否</Option>
                    <Option :value="'1'" >是</Option>
                  </Select>
                </Col>
                <Col span="4" align="center" >劳动合同甲方:</Col>
                <Col span="9">
                  <Input disabled v-model="showinfo.first_party" type="text" style="width: 35%"></Input>
                </Col>
              </Row>

              <Row class="bench_search" >
                <Col span="5" align="center" >其他甲方:</Col>
                <Col span="6">
                  <Input disabled v-model="showinfo.other_first_party" type="text" style="width: 35%"></Input>
                </Col>
                <Col span="4" align="center" >劳动关系证明:</Col>
                <Col span="9">
                  <Input disabled v-model="showinfo.prove" type="text" style="width: 35%"></Input>
                </Col>
              </Row>

              <Row class="bench_search" >
                <Col span="5" align="center" >其他证明:</Col>
                <Col span="6">
                  <Input disabled v-model="showinfo.other_prove" type="text" style="width: 35%"></Input>
                </Col>
              </Row>
            </div>
          </TabPane>
        </Tabs>
      </div>
    </Modal>
  </div>
</template>
<script>
import { getPersonCancellationList, getTypeNameList, getOffice, getPersonInfo } from '@/api/eventlist'
export default {
  data () {
    return {
      fileUrlList: [],
      fileUrlList2: [],
      fileUrlList3: [],
      personSelectionList: [],
      selection: [],
      mailList1: [],
      mailList2: [],
      mailList3: [],
      currentPageNo: 1,
      currentPageSize: 10,
      totalnum: 0,
      loadData: true,
      showModal: false,
      showinfo: {},
      searchInfo: {},
      dictList: [],
      data: [],
      familyInfoList: [],
      assessmentInfoList: [],
      sessionInfoList: [],
      columns: [
        {
          type: 'index',
          width: 50,
          align: 'center'
        },
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        { title: '姓名', key: 'CPBI003', width: 190, align: 'center' },
        { title: '性别', key: 'sex', width: 50, align: 'center' },
        { title: '年龄', key: 'age', width: 60, align: 'center' },
        { title: '是否超龄', key: 'isoverage', width: 100, align: 'center' },
        { title: '身份证号', key: 'CPBI002', minWidth: 160, align: 'center' },
        { title: '政治面貌', key: 'CPBI008', width: 100, align: 'center' },
        { title: '联系方式', key: 'CPBI013', width: 120, align: 'center' },
        { title: '所在区县', key: 'city_name', width: 100, align: 'center' },
        { title: '所在街道', key: 'street_name', width: 100, align: 'center' },
        { title: '所在社区', key: 'company_name', width: 100, align: 'center' },
        { title: '任职情况', key: 'CPWI006', width: 100, align: 'center' },
        { title: '社工状态', key: 'CPBI018', width: 100, align: 'center' },
        { title: '注销原因', slot: 'cancellation', width: 100, align: 'center' }
        ],
      familyInfoTable: [
        {
          title: '序号',
          type: 'index',
          width: 50,
          align: 'center'
        },
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        { title: '亲属姓名(必填)', slot: 'CPFI002', minWidth: 90, align: 'center' },
        { title: '亲属关系(必填)', slot: 'CPFI003', minWidth: 90, align: 'center' },
        { title: '亲属联系方式(必填)', slot: 'CPFI004', minWidth: 90, align: 'center' },
        { title: '工作单位(必填)', slot: 'CPFI005', minWidth: 90, align: 'center' },
        { title: '政治面貌(必填)', slot: 'CPFI006', minWidth: 90, align: 'center' },
        { title: '操作', slot: 'action1', minWidth: 90, align: 'center' }
      ],
      assessmentInfoTable: [
        {
          title: '序号',
          type: 'index',
          slot: 'id',
          width: 50,
          align: 'center'
        },
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        { title: '考核类型', slot: 'CPKI001', minWidth: 90, align: 'center' },
        { title: '考核时间', slot: 'CPKI002', minWidth: 90, align: 'center' },
        { title: '考核成绩', slot: 'CPKI003', minWidth: 90, align: 'center' },
        { title: '操作', slot: 'action1', minWidth: 90, align: 'center' }
      ],
    }
  },
  methods: {
    findinit () {
      this.currentPageNo = 1
      this.init()
    },
    init() {
      this.searchInfo.pageSize = this.currentPageSize
      this.searchInfo.pageNo = this.currentPageNo
      getPersonCancellationList(this.searchInfo).then(res => {
        if (res.data.errcode === 0) {
          let data = []
          res.data.data.results.forEach(function (temp, index) {
            if (temp.CPWI023 === '1') {
              temp.city_name = '社区工作者协会'
            }
            if (temp.CPWI024 === '1') {
              temp.street_name = '社区工作者协会'
            }
            data.push(temp)
          })
          this.data = data
          this.loadData = false
          this.totalnum = res.data.data.totalRecord
        } else {
          this.$Notice.error({
            title: '获取列表失败',
            desc: res.data.errmsg
          })
          this.loadData = false
        }
      })
    },
    getTypeName (id, index) {
      getTypeNameList({ typegroupcode: id }).then(res => {
        if (res.data.errcode === 0) {
          this.dictList[index] = res.data.data
        } else {
          this.$Notice.error({
            title: '获取字典列表失败',
            desc: res.data.errmsg
          })
        }
      })
    },
    getDictList () {
      this.getTypeName('political', 0)
      this.getTypeName('position', 1)
      this.getTypeName('cpbi018', 2)
      this.getTypeName('marriage', 3)
      this.getTypeName('nation', 4)
      this.getTypeName('incumbency', 5)
      this.getTypeName('sp_status', 6)
      this.getTypeName('degree', 7)
      this.getTypeName('academic', 8)
      this.getTypeName('lineal', 9)
      this.getTypeName('pqoswt', 10)
      this.getTypeName('train', 11)
      this.getTypeName('examType', 12)
      this.getTypeName('examresult', 13)
      this.getTypeName('cpCancel', 14)
    },
    size (pageSize) {
      this.currentPageSize = pageSize
      this.changePageNo()
    },
    changePageNo (pageNo) {
      this.currentPageNo = pageNo
      this.init()
    },
    getMailList (grade, code) {
      // this.searchInfo['grade' + (index + 1)] = 0
      getOffice({ grade: grade, code: code }).then(res => {
        if (res.data.errcode === 0) {
          this.mailList1 = res.data.data
          let xiehui = {code: "1", name: "社区工作者协会", master: "社区工作者协会"}
          this.mailList1.push(xiehui)
          // this.mailList[index].unshift({ id: 0, title: '全部' })
          // this.$forceUpdate()
        } else {
          this.$Notice.error({ title: '获取信息失败', desc: '查询区域列表信息失败' })
        }
      })
    },
    getMailList2 (grade, code) {
      // this.searchInfo['grade' + (index + 1)] = 0
      getOffice({ code: code }).then(res => {
        if (res.data.errcode === 0) {
          if (grade === 4) {
            this.mailList2 = res.data.data
            let xiehui = {code: "1", name: "社区工作者协会", master: "社区工作者协会"}
            this.mailList2.push(xiehui)
          } else if (grade === 5) {
            this.mailList3 = res.data.data
          }
          // this.mailList[index].unshift({ id: 0, title: '全部' })
          // this.$forceUpdate()
        } else {
          this.$Notice.error({ title: '获取信息失败', desc: '查询区域列表信息失败' })
        }
      })
    },
    showPerson (type) {
      // this.addinfo.files = ''
      // this.addinfo.files2 = ''
      // this.addinfo.files3 = ''
      let election = this.$refs.personSelection.getSelection()
      if (this.selection.length > 1 || this.selection.length == 0) {
        this.$Notice.error({
          title: '获取人员信息失败',
          desc: '请选择一条记录'
        })
        return
      }
      if (type === 1) {
        this.showModal = true
      }

      this.fileUrlList = []
      this.fileUrlList2 = []
      this.fileUrlList3 = []

      let id = this.selection[0].ID
      getPersonInfo({ id: id }).then(res => {
        if (res.data.errcode === 0) {
          // res.data.data.salary  = parseInt(res.data.data.salary !== '' || undefined ? res.data.data.salary : 0) / 100
          this.showinfo = res.data.data
          if (res.data.data.CPBI015) {
            this.judge = true
            this.fileUrlList.push(res.data.data.CPBI015)
          } else {
            this.judge = false
          }
          if (res.data.data.CPBI016) {
            this.judge2 = true
            this.fileUrlList2.push(res.data.data.CPBI016)
          } else {
            this.judge2 = false
          }
          if (res.data.data.CPBI019) {
            this.judge3 = true
            this.fileUrlList3.push(res.data.data.CPBI019)
          } else {
            this.judge3 = false
          }
          // if (this.companyGrade === '2') {
          this.getMailList2(4,this.showinfo.CPWI023)
          this.showinfo.CPWI024 = res.data.data.CPWI024
          this.getMailList2(5,this.showinfo.CPWI024)
          // }
          // this.fileUrlList.push(res.data.data.CPBI015)
          // this.fileUrlList2.push(res.data.data.CPBI016)
          // this.fileUrlList3.push(res.data.data.CPBI019)
          this.index1 = this.fileUrlList.length - 1
          this.index2 = this.fileUrlList2.length - 1
          this.index3 = this.fileUrlList3.length - 1
          if (res.data.data.CPWI017 !== undefined) {
            this.showinfo.CPWI017 = res.data.data.CPWI017.toString().split(',')
          }
          if (res.data.data.personnel_type !== undefined) {
            this.showinfo.personnel_type = res.data.data.personnel_type.toString().split(',')
          }
          this.familyInfoList = res.data.data.familyInfoList
          this.assessmentInfoList = res.data.data.assessmentInfoList
          this.sessionInfoList = res.data.data.sessionInfoList
        } else {
          this.$Notice.error({
            title: '获取人员信息失败',
            desc: res.data.errmsg
          })
        }
      })
    },
    personSelection () {
      this.personSelectionList = this.$refs.personSelection.getSelection()
    },
    selectTable (selection) {
      console.log(selection)
      this.selection = selection
    },
  },
  mounted() {
    this.getDictList()
    this.init()
    if (this.companyGrade < 3) {
      this.getMailList(2, null)
    } else if (this.companyGrade < 4) {
      this.getMailList2(4, this.companyCode)
    } else if (this.companyGrade < 5) {
      this.getMailList2(5, this.companyCode)
    }
  },
  computed: {
    companyGrade () {
      return this.$store.state.user.severUserInfo.company_grade
    },
    companyCode () {
      return this.$store.state.user.severUserInfo.company_code
    }
  }
}
</script>
<style>
  .search-info-style {
    margin: 10px;
  }
  .new-btn-sty {
    margin-right: 5px;
    color: #fff;
    background-color: #235CA7;
    border-color: #235CA7;
    font-weight: 500;
  }
  .item1{
    height: 42px;
    line-height: 40px;
  }
  .page_style {
    margin-top: 10px;
    text-align: right;
  }
  .bench_search {
    margin-bottom: 10px;
  }
</style>
